<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>

		<style>
			* {
				box-sizing: border-box;
			}

			input,
			textarea {
				display: block;
				width: 100%;
				height: 40px;
				/* outline: none; */
				padding: 5px 10px;
				border: 1px solid rgba(0, 0, 0, .1);
				margin-bottom: 5px;
				max-width: 500px;
			}

			/* 提交按钮 */
			input[type="submit"]:hover {
				cursor: pointer;
				background-color: #226af6;
				color: white;
				border: 1px solid blue;
			}
		</style>
	</head>

	<body>
		<!-- 
		 
		 
		这里进行 演示：
		 注意 datetime-local 不支持秒的， 只支持下面的格式
		 
		 
		 
		 
		 //  2020-03-05T13:30
			// remind_at: "2022-05-12T08:19"
		 
			value="2015-07-19T05:20:10"
		
		
		 -->

		<div id="app">

			<form @submit.prevent="submit" id="taskform">
				<div>
					<input type="datetime-local" name="" v-model="current.remind_at">
				</div>
				<input type="submit" value="提交">
			</form>


		</div>



		<script src="../lib/vue.js"></script>
		<script src="js/mydate.js"></script>

		<script>
			var app = new Vue({
				el: '#app',
				data: {
					list: [],

					current: {
						title: '',
						completed: false,
						desc: '....',
						remind_at: this.default_remind_at,
						confirmed: false,
					},
				},


				// el 被新创建的 vm.$el 替换, 挂在成功	
				mounted: function() {
					// console.log('mounted...')
					var me = this;
					// this.default_remind_at = new Date().format("yyyy-MM-ddThh:mm:ss")
					this.default_remind_at = new Date().format("yyyy-MM-ddThh:mm")
					this.current.remind_at = this.default_remind_at;


				},


				methods: {
					// copy obj 对象 
					deepcopy: function(obj) {
						var copyed = Object.assign({}, obj);
						return copyed
					},

					submit: function() {
						console.log('add a plan ..');

						var todo = this.deepcopy(this.current);

						this.list.push(todo);
						console.log(todo.remind_at);

					},
				}




			});
		</script>
	</body>
</html>
